<%@ page import="wish.Wish" %>
<%@ page import="wish.WishItem" %>
<%@ page import="cook.Dish" %>


<script type="text/javascript">
	
	var childCount = ${wish?.wishItems?.size()} + 0;

	function addChild(){
		var htmlId = "wishItem" + childCount;
		
		var deleteIcon = "${resource(dir:'images/skin',file:'database_delete.png')}";
		var templateHtml = "<div class='span12' id='" + htmlId + "' name='" + htmlId +"'>";
		templateHtml += "${message(code:'wishItem.dish.label')}"
		templateHtml += "<select id='wishItems["+childCount+"].dish' name='wishItems["+childCount+"].dish.id'>"
		<%
		Dish.findAll().each{
			out.println("templateHtml +=\"<option value='"+it.id+"'>"+it+"</option>\" ")
			
		}
		
		%>

		templateHtml += "</select>"

		templateHtml += "${message(code:'wishItem.quantity.label')}"
		templateHtml += "<input type='number' id='wishItems["+childCount+"].quantity' name='wishItems["+childCount+"].quantity' step='0.01' min='0.0' value='0'/>";

		templateHtml += "</div>"
		$("#childList").append(templateHtml);
		
		childCount++;
		
	}

	
</script>

<div id="childList">
	
	<g:each var="wishItemInstance" in="${wishInstance?.wishItems}" status="i">

		
			<div class="span12">
				<g:message code="wishItem.dish.label" default="Dish" />
				<g:select id="dish" name="wishItems[${i}].dish.id" from="${cook.Dish.list()}" optionKey="id" required="" value="${wishItemInstance?.dish?.id}" class="many-to-one"/>
				<span class="help-inline">${hasErrors(bean: wishItemInstance, field: 'dish', 'error')}</span>
			
				<g:message code="wishItem.quantity.label" default="Quantity" />
				<g:field type="number" name="wishItems[${i}].quantity" step="0.01" min="0.0" required="" value="${wishItemInstance.quantity}"/>
				<span class="help-inline">${hasErrors(bean: wishItemInstance, field: 'quantity', 'error')}</span>
			</div>

	</g:each>
	
</div>
<input type="button" value="Agregar item" onClick="addChild();" />
